﻿
@model Bordspil.Models.GameInstance

@{
    ViewBag.Title = "Borðspil.com - " + Model.PlayerName;
}



<div id ="waiting">
     <img src="~/Content/ajax-loader2.gif" />
    <ul id ="wait"></ul>
</div>
<table id ="tictactoe">
    <tbody>
		<tr>
			<td id="cell1">&nbsp;</td>
			<td id="cell2">&nbsp;</td>
			<td id="cell3">&nbsp;</td>
		</tr>
		<tr>
			<td id="cell4">&nbsp;</td>
			<td id="cell5">&nbsp;</td>
			<td id="cell6">&nbsp;</td>
		</tr>
		<tr>
			<td id="cell7">&nbsp;</td>
			<td id="cell8">&nbsp;</td>
			<td id="cell9">&nbsp;</td>
		</tr>
      
    </tbody>
</table>
<div id="ludo-notifiaction">

        <ul id="notification">

        </ul>
 
</div>
<div id="game">
    <h2 class="game-name">TicTacToe</h2>
    <p>Einkunn: <span id="game-rating"></span>
    <button class="btn btn-danger rating" value="+">+</button>
    <button class="btn btn-danger rating" value="-">-</button><span class="rating-done"></span>
    </p>
    <ul class="player-list">
        
    </ul>
    <ul class="game-rules">
        <li>Þú ert leikmaður 'X'.</li>
        <li>Reyndu að fá þrjú 'X' í röð, lárétt, lóðrétt eða á ská til að vinna.</li>
        <li>Stigagjöf:</li>
        <li>1. sæti 5 stig</li>
        <li>2. sæti 1 stig</li>
        <li></li>
        <li>Jafntefli 1 stig</li>

    </ul>
    
</div>

<script type="text/javascript">


    $(function () {
        //upphaflegur kodi fra dabs en mikid breyttur af okkur!

        $("#ludo-notifiaction").hide();

        var counter = 0;
        
        var group = '@(Model.InstanceId)';
        var userName = '@(User.Identity.Name)';
        var begin = false;
        var myTurn = false;

        var hub = $.connection.ticTacToeHub;

        $.connection.hub.start().done(function () {
            hub.server.join(group, userName);

            hub.server.startGame(group);
           
        });

        hub.client.startGame = function (msg, starter) {
            //console.log(msg + " " + " sa sem byrjar " + starter);
            if (msg == "start") {
                //ef server sendir start ta ma leikur byrja, ta eru 2 leikmenn tengdir
                $("#waiting").hide();
                $("#wait").empty();
                begin = true;

                GetPlayerlistByInstanceId(group);

                if (starter === userName) {
                    //sa sem byrjar er alltaf sa sem stofnar
                    myTurn = true;
                }
                //birti notification center
                $("#ludo-notifiaction").show();
                $("#notification").append("<li>" + starter + " byrjar</li>");

            }
            else {
                $("#wait").append("<li>Beðið eftir leikmanni</li>");
            }
        };

        hub.client.whosTurnIsIt = function (user) {
            //console.log(user);
            if (user != userName) {

                //ef eg a ad gera ta skrifast tad 
                $("#notification").prepend("<li>" + userName + " á að gera</li>");

                myTurn = true;
            } else {
                //annars skrifast nafn notanda sem a ad gera
                $("#notification").prepend("<li>" + user + " á að gera</li>");
                myTurn = false;
            }
        }

        $("#tictactoe tr td").click(function () {
            
            if (myTurn === true) {
                
                if (this.innerHTML != "&nbsp;") {
                    //ef reitur er ekki tomir ta tarf notandi ad velja ser annan reit til ad smella  a
                    //console.log("ekki tómt");
                    return;
                }
                if (begin === true) {
                    hub.server.clickCell(group, this.id);
                    $(this).text("X");
                    
                    counter = counter + 1;
                    //console.log(counter);
                    $(this).addClass("red");
                    if (CheckX() === true) {
                        //ef X vinnur ta faer sa notandi 5 stig og er sigurvegari
                        $("#ludo-notifiaction").hide();
                        begin = false;
                        $("#waiting").show();
                        $("#wait").append("<li>Til hamingju þú vannst og færð 5 stig</li> <li>Þér verður vísað aftur á forsíðu</li>");
                        GivePoints(userName, 5);
                        setTimeout(function () { document.location.href = "/" }, 5000);
                    }
                    else if (counter === 9) {
                        //ef counter kemst i 9 ta er jafntefli og notandi faer 1 stig
                        $("#ludo-notifiaction").hide();
                        begin = false;
                        $("#waiting").show();
                        $("#wait").append("<li>Jafntefli, þú færð 1 stig</li> <li>Þér verður vísað aftur á forsíðu</li>");
                        GivePoints(userName, 1);
                        setTimeout(function () { document.location.href = "/" }, 5000);
                    }
                    $("#notification").empty();
                    myTurn = false;
                } else {
                    console.log("mattigigera");
                }
                //segi ad naesti ma gera
                hub.server.whosTurnIsIt(group, userName);
            }
        });

        hub.client.cellClicked = function (cellId) {
            $("#" + cellId).text("O");
            counter = counter + 1;
            $("#" + cellId).addClass("blue");
            if (CheckO() === true) {
                //ef o vinnur ta tapar notandi og faer 1 stig
                $("#ludo-notifiaction").hide();
                begin = false;
                $("#waiting").show();
                $("#wait").append("<li>Æjj þú tapaðir, gengur betur næst. Þú færð 1 stig</li> <li>Þér verður vísað aftur á forsíðu </li>");
                GivePoints(userName, 1);
                setTimeout(function () { document.location.href = "/" }, 5000);
                
            }
            else if (counter === 9) {
                $("#ludo-notifiaction").hide();
                begin = false;
                $("#waiting").show();
                $("#wait").append("<li>Jafntefli, þú færð 1 stig</li> <li>Þér verður vísað aftur á forsíðu</li>");
                GivePoints(userName, 1);
                setTimeout(function () { document.location.href = "/" }, 5000);
            }
        };

        function CheckX() {
            //fall til ad athuga hvort X hafi unnid
            if (cell1.innerHTML === "X" && cell2.innerHTML === "X" && cell3.innerHTML === "X") {
                return true;
            } else if (cell4.innerHTML === "X" && cell5.innerHTML === "X" && cell6.innerHTML === "X") {
                return true;
            }
            else if (cell7.innerHTML === "X" && cell8.innerHTML === "X" && cell9.innerHTML === "X") {
                return true;
            }
            else if (cell1.innerHTML === "X" && cell4.innerHTML === "X" && cell7.innerHTML === "X") {
                return true;
            }
            else if (cell2.innerHTML === "X" && cell5.innerHTML === "X" && cell8.innerHTML === "X") {
                return true;
            }
            else if (cell3.innerHTML === "X" && cell6.innerHTML === "X" && cell9.innerHTML === "X") {
                return true;
            }
            else if (cell1.innerHTML === "X" && cell5.innerHTML === "X" && cell9.innerHTML === "X") {
                return true;
            }
            else if (cell3.innerHTML === "X" && cell5.innerHTML === "X" && cell7.innerHTML === "X") {
                return true;
            }
        }

        function CheckO() {
            //fall sem athugar hvort O hafi unnid (tapad)
            if (cell1.innerHTML === "O" && cell2.innerHTML === "O" && cell3.innerHTML === "O") {
                return true;
            } else if (cell4.innerHTML === "O" && cell5.innerHTML === "O" && cell6.innerHTML === "O") {
                return true;
            }
            else if (cell7.innerHTML === "O" && cell8.innerHTML === "O" && cell9.innerHTML === "O") {
                return true;
            }
            else if (cell1.innerHTML === "O" && cell4.innerHTML === "O" && cell7.innerHTML === "O") {
                return true;
            }
            else if (cell2.innerHTML === "O" && cell5.innerHTML === "O" && cell8.innerHTML === "O") {
                return true;
            }
            else if (cell3.innerHTML === "O" && cell6.innerHTML === "O" && cell9.innerHTML === "O") {
                return true;
            }
            else if (cell1.innerHTML === "O" && cell5.innerHTML === "O" && cell9.innerHTML === "O") {
                return true;
            }
            else if (cell3.innerHTML === "O" && cell5.innerHTML === "O" && cell7.innerHTML === "O") {
                return true;
            }
        } 

        function GivePoints(userName, points) {
            //ser um ad gefa stig til notanda
            var sendData = {
                "userName": userName,
                "gameId": 2,
                "points": points
            };
            $.post("/Highscore/GivePoints", sendData, function (data) {
                //console.log(data);
            });
        }

        function GetPlayerlistByInstanceId(instanceId) {
            //skilar leikmanna lista og prentar hann ut a sidu
                $.ajax({
                    type: "GET",
                    corntentType: "application/json; charset=utf-8",
                    url: "/Home/GetPlayersByInstanceId",
                    data: { "instanceId": instanceId },
                    dataType: "json",
                    success: function (data) {
                        
                            $(".player-list").append("<li class='player2-name'>" + data[0].PlayerName + "</li>");
                            $(".player-list").append("<li class='player4-name'>" + data[1].PlayerName + "</li>");
                        
                    }
                });
            
        }
        
    });
  

    
</script>